import React from 'react'
import Head from '../component/Head'
import styles from '../css2/SetList.module.scss'
import { MyIcon } from '../MyIcon/MyIcon'
import { Dialog , Toast } from 'react-vant';
import {useNavigate} from 'react-router-dom'
export default function SetList() {
    const navigate=useNavigate()
    return (
        <div style={{ backgroundColor: '#F2F2F2', height: '100vh' }}>
            <Head titleName='设置'></Head>
            <div style={{ borderTop: '8px solid #F2F2F2' }} className={styles.setList}>
                <div onClick={()=>{navigate('/app/setting/information')}} className={styles.set_ele}>
                    <div className={styles.set_title}>账号资料</div>
                    <div><MyIcon type='icon-xiangyoujiantou'></MyIcon></div>
                </div>
                <div onClick={()=>{navigate('/app/setting/secure')}} className={styles.set_ele}>
                    <div className={styles.set_title}>账号绑定与安全</div>
                    <div><MyIcon type='icon-xiangyoujiantou'></MyIcon></div>
                </div>
            </div>
            <div className={styles.setList}>
                <div onClick={()=>{navigate('/app/setting/push')}} className={styles.set_ele}>
                    <div className={styles.set_title}>推送设置</div>
                    <div><MyIcon type='icon-xiangyoujiantou'></MyIcon></div>
                </div>
                <div onClick={()=>{navigate('/app/setting/appreciate')}} className={styles.set_ele}>
                    <div className={styles.set_title}>赞赏设置</div>
                    <div><MyIcon type='icon-xiangyoujiantou'></MyIcon></div>
                </div>
                <div className={styles.set_ele}>
                    <div className={styles.set_title}>清除缓存</div>
                    <div>
                        207M
                        {/* <MyIcon type='icon-xiangyoujiantou'></MyIcon> */}
                    </div>
                </div>
            </div>
            <div className={styles.setList}>
                <div onClick={()=>{Toast.info('当前已是最新版本')}} className={styles.set_ele}>
                    <div className={styles.set_title}>检查新版本</div>
                    <div><MyIcon type='icon-xiangyoujiantou'></MyIcon></div>
                </div>
                <div onClick={()=>{navigate('/app/setting/about')}} className={styles.set_ele}>
                    <div className={styles.set_title}>关于我们</div>
                    <div>
                        <MyIcon type='icon-xiangyoujiantou'></MyIcon>
                    </div>
                </div>
            </div>
            <div style={{ borderBottom: 'none' }} className={styles.setList}>
                <div onClick={async () => {
                    try {
                        await Dialog.confirm({
                            // confirmButtonColor:'white',
                            // className:styles.botton,
                            message: '确定退出账号吗',
                        })
                        sessionStorage.removeItem('token')
                        sessionStorage.removeItem('user')
                        sessionStorage.removeItem('userid')
                        navigate('/app/my')
                    } catch (error) {
                        console.log('cancel')
                    }
                }} style={{ borderBottom: 'none' }} className={styles.set_ele}>
                    <div className={styles.set_title}>退出账号</div>
                    {/* <div><MyIcon type='icon-xiangyoujiantou'></MyIcon></div> */}
                </div>
            </div>
        </div>
    )
}
